<template>
    <div>
        <x-header :left-options="{backText: ''}">我的活动</x-header>
        <tab>
            <tab-item selected @on-item-click="handler(111)">未评价</tab-item>
            <tab-item @on-item-click="handler(222)">已评价</tab-item>
            <tab-item @on-item-click="handler(333)">未通过</tab-item>
        </tab>
        <div class="wrap">
            <div v-for="act in list">
                <form-preview :header-label="('活动信息')" header-value="." :body-items="act" v-if="notComment"
                              :footer-buttons="buttons" @click.native="comment(act[3].value)">
                </form-preview>
                <form-preview :header-label="('活动信息')" header-value="." :body-items="act" v-if="commented">
                </form-preview>
                <form-preview :header-label="('活动信息')" header-value="." :body-items="act" v-if="notPass"
                              :footer-buttons="buttons1" @click.native="getDetail(act[4].value)">
                </form-preview>
                <divider>我是分割线</divider>
            </div>
            <load-more v-if="loading" :tip="tip"></load-more>
            <load-more v-if="!loading" :show-loading="false" :tip="('暂无数据')" background-color="#fbf9fe"></load-more>
        </div>
    </div>
</template>

<script>
    import {Group, XHeader, FormPreview, Tab, TabItem, Divider, LoadMore, Rater, Cell} from 'vux'
    import request from 'superagent'

    export default {
        components: {
            Group,
            XHeader,
            Tab,
            TabItem,
            FormPreview,
            Divider,
            LoadMore,
            Rater,
            Cell
        },
        data () {
            return {
                list: [],
                activities: '',
                buttons: [{
                    style: 'primary',
                    text: '评价',
                    onButtonClick: () => {
                    }
                }],
                buttons1: [{
                    style: 'primary',
                    text: '修改',
                    onButtonClick: (obj) => {
                        console.log(obj)
                    }
                }],
                loading: false,
                tip: '正在加载',
                notComment: false,
                commented: false,
                notPass: false
            }
        },
        created: function () {
            this.getData('NOT_COMMENT');
            this.notPass = true;
        },
        methods: {
            getData(flag) {
                this.loading = true;
                this.list = [];
                setTimeout(() => {
                    request.get('/wx/activity/useractivitylist')
                        .query({flag: flag})
                        .end((err, res) => {
                                console.log(res);
                                const data = JSON.parse(res.text).data;
                                this.activities = data;
                                if (flag == 'NOT_COMMENT') {
                                    this.notComment = true;
                                    this.commented = false;
                                    this.notPass = false;
                                    for (let act of data) {
                                        const temp = [];
                                        let obj = new Object();
                                        obj.label = '活动名称';
                                        obj.value = act.name;
                                        temp.push(obj);
                                        let obj1 = new Object();
                                        obj1.label = '活动时间';
                                        obj1.value = act.startDate;
                                        temp.push(obj1);
                                        let obj2 = new Object();
                                        obj2.label = '发起人';
                                        obj2.value = act.sponsorName;
                                        temp.push(obj2);
                                        let obj3 = new Object();
                                        obj3.label = '活动编号';
                                        obj3.value = act.id;
                                        temp.push(obj3);
                                        this.list.push(temp);
                                    }
                                }
                                if (flag == "COMMENT") {
                                    this.notComment = false;
                                    this.commented = true;
                                    this.notPass = false;
                                    for (let act of data) {
                                        const temp = [];
                                        let obj = new Object();
                                        obj.label = '活动名称';
                                        obj.value = act.name;
                                        temp.push(obj);
                                        let obj1 = new Object();
                                        obj1.label = '活动时间';
                                        obj1.value = act.startDate;
                                        temp.push(obj1);
                                        let obj2 = new Object();
                                        obj2.label = '发起人';
                                        obj2.value = act.sponsorName;
                                        temp.push(obj2);
                                        let obj3 = new Object();
                                        obj3.label = '评分';
                                        obj3.value = this.convertScore(act.score);
                                        temp.push(obj3);
                                        let obj4 = new Object();
                                        obj4.label = '评论';
                                        obj4.value = act.content;
                                        temp.push(obj4);
                                        let obj5 = new Object();
                                        obj5.label = '活动编号';
                                        obj5.value = act.id;
                                        temp.push(obj5);
                                        this.list.push(temp);
                                    }
                                }
                                if (flag == "NOTPASS") {
                                    this.notComment = false;
                                    this.commented = false;
                                    this.notPass = true;
                                    for (let act of data) {
                                        const temp = [];
                                        let obj = new Object();
                                        obj.label = '活动名称';
                                        obj.value = act.name;
                                        temp.push(obj);
                                        let obj1 = new Object();
                                        obj1.label = '活动时间';
                                        obj1.value = act.startDate;
                                        temp.push(obj1);
                                        let obj2 = new Object();
                                        obj2.label = '发起人';
                                        obj2.value = act.sponsorName;
                                        temp.push(obj2);
                                        let obj5 = new Object();
                                        obj5.label = '未通过原因';
                                        obj5.value = act.desn;
                                        console.log(obj5.value)
                                        temp.push(obj5);
                                        let obj6 = new Object();
                                        obj6.label = '活动编号';
                                        obj6.value = act.id;
                                        temp.push(obj6);
                                        this.list.push(temp);
                                    }
                                }
                            }
                        );
                    this.loading = false;
                }, 1000);
            },
            handler(index) {
                if (index == 111) {
                    this.getData('NOT_COMMENT');
                }
                if (index == 222) {
                    this.getData('COMMENT');
                }
                if (index == 333) {
                    this.getData("NOTPASS");
                }
            },
            comment(id) {//跳转到评论页面
                console.log(id+"==>评论")
                this.$router.push({path: 'comment', query: {actId: id}});
            },
            getDetail(id) {
                console.log(id+"==>获取")
                this.$router.push({path: 'editActivity', query: {actId: id}});
            },
            commentDetail(id){
                console.log(id)
                this.$router.push({path: 'commentlist', query: {actId: id}});
            },
            convertScore(score) {
                let res = '';
                for (let i = 0; i < score; i++) {
                    res += '★';
                }

                return res;
            }
        }
    }

</script>

<style>
    .wrap {
        max-width: 600px;
        height: 480px;
        margin: 0 auto;
        overflow-y: auto;
        text-align: center;
        margin-top: 5px;
    }
</style>